/*postcss-pxtransform rn eject enable*/

.coupon {
  &_item {
    width: 670px;
    height: 360px;
    padding-top: 36px;
    background-color: #fff;
    background-repeat:  no-repeat;
    background-image: url('https://static.360buyimg.com/tp-statics/2018-4-17/m/img/coupon_bg.png');
    background-size: 100% 100%;
    margin: 0 auto 20px;
    text-align: center;

    &.cantSelect {
      background-color: #fff;
      background-repeat:  no-repeat;
      background-image: url('https://static.360buyimg.com/tp-statics/2018-4-17/m/img/gray_coupon_bg.png');
      background-size: 100% 100%;

      view {
        color: #ccc;
      }
      .coupon_tit {
        background-repeat:  no-repeat;
        background-image: url('https://static.360buyimg.com/tp-statics/2018-4-17/m/img/uncoupon_toplife.png');
        background-size: 100% 100%;
      }
      .coupon_need_money {
        &::before,
        &::after {background-color: #ccc;}
      }
      .coupon_btn_use {background-color: #999;color: #fff;}
    }
  }
  &_tit {
    width: 129px;
    height: 10px;
    margin: 0 auto;
    background: url('https://static.360buyimg.com/tp-statics/2018-4-17/m/img/coupon_toplife.png') no-repeat;
    background-size: 100% 100%;
  }
  &_value {
    color: #c4a66a;
    font-size: 30px;
    font-style: italic;
    font-weight: 300;
    margin-top: 35px;

    text {font-size: 70px;font-weight: 400;}
  }
  &_need_money,
  &_limit,
  &_time,
  &_btn_use {
    font-size: 24px;
    font-weight: 300;
  }
  &_need_money {
    color: #c4a66a;
    text {
      padding: 0 16px;
    }
    &::before,
    &::after {
      width: 7px;
      height: 7px;
      background-color: #c4a66a;
      display: inline-block;
      content: "";
      vertical-align: middle;
      transform: rotate(45deg);
    }
  }
  &_limit,
  &_time {
    transform: scale(0.8);
  }
  &_limit {
    margin-top: 30px;
  }
  &_btn_use {
    width: 200px;
    height: 50px;
    line-height: 50px;
    margin: 0 auto;
    background-color: #232321;
    color: #fff;
    position: relative;
    top: 36px;
  }
  &_btn_check {
    text-align: center;
    font-size: 26px;
    font-weight: 300;
    color: #232321;
    margin: 60px 0 30px;
    &::after {
      width: 26px;
      height: 16px;
      display: inline-block;
      content: '';
      background-repeat:  no-repeat;
      background-image: url('https://static.360buyimg.com/tp-statics/2018-4-17/m/img/ic_coupon_downarrow_black@2x.png');
      background-size: 100% 100%;
      margin-left: 10px;
    }

    &.open {
      &::after {
        background-repeat:  no-repeat;
        background-image: url('https://static.360buyimg.com/tp-statics/2018-4-17/m/img/ic_coupon_uparrow_black@2x.png');
        background-size: 100% 100%;
      }
    }
  }
}
